<template>
	<div class="maintain">
		<x-header @on-click-back="onClickBack" :left-options="{preventGoBack:true}">编辑开票信息
      <a href="javascript:;" class="save" @click="saveAction(submitType)">保存</a>
		  <a href="javascript:;" class="submit" @click="submitAction">提交</a>
    </x-header>
    <div style="background-color: #f7f7f7;height: 0.2778rem;widht: 100%;"></div>
		<div class="maintainContent">
      <div class="information-item">
        <div class="information-item-title">票据类型</div>
        <popup-picker class="information-item-input" :data="BILL_TYPE_LIST" show-name v-model="BILL_TYPE" @on-change="onPopupChange($event,'BILL_TYPE')" placeholder="请选择"></popup-picker>
        <!-- <img  class="information-item-rightImg" src="../../assets/img/securityCheckImg/rightArrow.png" alt=""> -->
      </div>
      <div class="information-item">
        <div class="information-item-title">增值税名</div>
        <input class="information-item-input" v-model="VAT_NAME" type="text" maxlength="16" placeholder="请录入" value="">
      </div>
      <div class="information-item">
        <div class="information-item-title">增值税号</div>
        <input class="information-item-input" v-model="VAT_NO" type="text" maxlength="16" placeholder="请录入" value="">
      </div>
      <div class="information-item">
        <div class="information-item-title">增值税银行</div>
        <input class="information-item-input" v-model="BANK_CODE" type="text" maxlength="16" placeholder="请录入" value="">
      </div>
      <div class="information-item">
        <div class="information-item-title">增值税账号</div>
        <input class="information-item-input" v-model="VAT_ACCT" type="text" maxlength="16" placeholder="请录入" value="">
      </div>
      <div class="information-item">
        <div class="information-item-title">注册地址</div>
        <input class="information-item-input" v-model="REG_ADDR" type="text" maxlength="16" placeholder="请录入" value="">
      </div>
      
      <div class="information-item">
        <div class="information-item-title">出票分类</div>
         <popup-picker class="information-item-input" :data="DRAW_BILL_TYPE_LIST" show-name v-model="DRAW_BILL_TYPE" @on-change="onPopupChange($event,'DRAW_BILL_TYPE')" placeholder="请选择"></popup-picker>
        <!-- <img  class="information-item-rightImg" src="../../assets/img/securityCheckImg/rightArrow.png" alt=""> -->
      </div>
      <div class="information-item">
        <div class="information-item-title">开票附件</div>
      </div>
    </div>
    <div class="information-images">
      <div class="information-image  information-image-positive" v-if="photoPath == ''" @click="takePhoto">
        <img  class="information-image-icon" src="../../assets/img/securityCheckImg/camera.png" alt="">
      </div>
      <div class="information-image information-image-positive information-image-path" v-else>
        <img  class="information-image-iconDelete" @click="deletePhoto" src="../../assets/img/securityCheckImg/deletephoto.png" alt="">
        <img class="information-image-iconPath" :src="photoPath" alt="">
      </div>
    </div>
    <!-- <div class="information-addIcon" @click="addIconClick">
      <div class="information-addIcon-div">
        <img class="information-addIcon-icon" src="../../assets/img/securityCheckImg/addHeader.png" alt="">
      </div>
    </div> -->
	</div>
</template>

<script>
import { XHeader, PopupPicker } from "vux";
import {
  userInfoFn,
  sqlInsert,
  sqlUpdata,
  sqlFILE_Query,
  sqlFILE_Insert,
  sqlFILE_Delete,
  submitremoval,
  sqlUpdataChange
} from "@/utils/sqlOperation";
import { takePhoto, deletePhoto } from "@/utils/public";
import { getsn } from "@/utils/getsn";
import Vue from "vue";
export default {
  data() {
    return {
      BILL_TYPE: [],
      BILL_TYPE_LIST: [
        [{ name: "专票", value: "01" }, { name: "普票", value: "02" }]
      ],
      DRAW_BILL_TYPE: [],
      DRAW_BILL_TYPE_LIST: [
        [{ name: "纸质发票", value: "01" }, { name: "电子发票", value: "02" }]
      ],
      VAT_ID: '',
      APP_NO: "",
      CONS_NO: "",
      VAT_NAME: "",
      VAT_NO: "",
      BANK_CODE: "",
      VAT_ACCT: "",
      REG_ADDR: "",
      photoPath: "",
      change_type: 1,
      FILE: [],
      arr: [],
      FILE_LIST: [],
      M_CID: "",
      submitType: 1,
      userInfoData: null
    };
  },
  components: {
    XHeader,
    PopupPicker
  },
  mounted() {
    Vue.set(this, "CONS_NO", localStorage.getItem("CONS_NO"));
    const _this = this;
    if (_this.$route.query.item) {
      const item = JSON.parse(_this.$route.query.item);
      console.log(11111111111111111, item);
      _this.M_CID = item.M_CID;
      _this.VAT_ID = item.VAT_ID;
      _this.CONS_NO = item.CONS_NO;
      _this.VAT_NAME = item.VAT_NAME;
      _this.VAT_NO = item.VAT_NO;
      _this.BANK_CODE = item.BANK_CODE;
      _this.VAT_ACCT = item.VAT_ACCT;
      _this.REG_ADDR = item.REG_ADDR;
      _this.BILL_TYPE[0] = item.BILL_TYPE;
      _this.DRAW_BILL_TYPE[0] = item.DRAW_BILL_TYPE;
      Vue.set(_this, "change_type", _this.$route.query.change_type);
      sqlFILE_Query(
        "TICKET_FILE_RELATION",
        "TICKET_CID",
        item.M_CID,
        _this.queryPhotoCallback
      );
    }
    userInfoFn(this.CONS_NO, this.userInfoCallback);
  },
  methods: {
    userInfoCallback(msg) {
      console.log("用户信息查询", msg);
      Vue.set(this, "userInfoData", msg[0]);
    },
    queryPhotoCallback(result) {
      console.log("开票图片查询", result);
      if (result.length > 0) {
        Vue.set(this, "photoPath", result[0].FILE_SRC);
        Vue.set(this, "FILE_LIST", result);
      }
    },
    queryData(file) {
      const _this = this;
      console.log(file);
      for (let i in file) {
        AndroidApi.queryTableData(
          JSON.stringify({
            whereClause: "SELECT * FROM TICKET_FILE_RELATION WHERE FILE_ID=?",
            whereArgs: [file[0].FILE_ID]
          }),
          function(msg) {
            console.log("aaaaaaaaaaaaaaaaaaaaaaaaaaaa", msg.result);
            if (msg.result.length == 0) {
              _this.arr.push(file[i]);
            }
            console.log("bbbbbbbbbbbbbbbbbbbbbbbbbbb", msg.result);
            if (i == file.length - 1) {
              _this.removePhoto(_this.arr);
            }
          }
        );
      }
    },
    removePhoto(arr) {
      console.log("ccccccccccccccccccccccccccccccccccccc", arr);
      const _this = this;
      if (arr.length == 0) {
        this.$router.go(-1);
      } else {
        for (let i in arr) {
          deletePhoto(arr[i].PATH, function(msg) {
            if (i == arr.length - 1) {
              _this.routerBack();
            }
          });
        }
      }
    },
    routerBack(msg) {
      if (this.change_type == 2) {
        this.insertFILE_RECORDE();
      } else {
        this.$router.go(-1);
      }
    },
    insertFILE_RECORDE() {
      const _this = this;
      console.log();
      if (_this.FILE_LIST.length > 0) {
        AndroidApi.insert(
          JSON.stringify({
            tableName: "FILE_RECORDE",
            contentValues: [
              {
                FILE_ID: _this.FILE_LIST[0].FILE_ID,
                APP_NO: _this.FILE_LIST[0].APP_NO,
                CONS_NO: _this.FILE_LIST[0].CONS_NO,
                FILE_SRC: _this.FILE_LIST[0].FILE_SRC,
                FILE_NAME: _this.FILE_LIST[0].FILE_NAME,
                ITEM_NO: "1024",
                BUSY_NO: "0"
              }
            ]
          }),
          function(msg) {
            _this.$router.go(-1);
            if (msg.resultCode === "9999") {
              console.log(msg);
            } else {
              console.log("error", msg);
            }
          }
        );
      } else {
        _this.$router.go(-1);
      }
    },
    onClickBack() {
      const _this = this;
      if (_this.FILE.length == 0) {
        if (_this.photoPath == "") {
          _this.insertFILE_RECORDE();
        } else {
          _this.$router.go(-1);
        }
      } else {
        console.log(this.FILE);
        this.queryData(this.FILE);
      }
    },
    saveAction(type) {
      const _this = this;
      Vue.set(this, "submitType", type);

      if (this.change_type == 2) {
        let data = [
          {
            CHANGE_TYPE: type == 2 ? "3" : "2",
            BILL_TYPE: this.BILL_TYPE[0],
            VAT_NAME: this.VAT_NAME,
            VAT_NO: this.VAT_NO,
            BANK_CODE: this.BANK_CODE,
            VAT_ACCT: this.VAT_ACCT,
            REG_ADDR: this.REG_ADDR,
            DRAW_BILL_TYPE: this.DRAW_BILL_TYPE[0]
          }
        ];
        console.log(222222222222, this.M_CID);
        console.log(JSON.parse(this.$route.query.item));
        if (this.M_CID) {
          sqlUpdata(
            "NOTE_INFO_CHANGE",
            JSON.parse(this.$route.query.item).M_CID,
            this.CONS_NO,
            data,
            this.callback
          );
        } else {
          AndroidApi.update(
            JSON.stringify({
              tableName: 'NOTE_INFO',
              whereClause:"CONS_NO = ?",
              whereArgs: [_this.CONS_NO],
              contentValues: data
            }),
            function(msg) {
              console.log(2222,msg);
              _this.$vux.toast.text("修改成功");
            }
          );
        }
        console.log(123123, this.FILE_LIST);
        if (this.FILE_LIST.length > 0) {
          deletePhoto(this.FILE_LIST[0].FILE_SRC, function(msg) {
            console.log(msg);
          });
          if (this.FILE.length > 0) {
            sqlFILE_Delete(
              "TICKET_FILE_RELATION",
              this.FILE_LIST[0].FILE_ID,
              this.photoFileCallback
            );
          } else {
            sqlFILE_Delete(
              "TICKET_FILE_RELATION",
              this.FILE_LIST[0].FILE_ID,
              function(str, msg) {
                comsole.log(msg);
              }
            );
          }
        } else {
          console.log(this.M_CID);
          if (this.FILE.length > 0) {
            const fileData = [
              {
                M_CID: getsn(),
                TICKET_CID: this.M_CID,
                FILE_ID: this.FILE[0].FILE_ID
              }
            ];
            sqlFILE_Insert(
              "TICKET_FILE_RELATION",
              fileData,
              this.photoFileCallback
            );
          }
        }
      } else {
        if (
          this.VAT_NAME == "" &&
          this.VAT_NO == "" &&
          this.BANK_CODE == "" &&
          this.VAT_ACCT == "" &&
          this.REG_ADDR == "" &&
          this.BILL_TYPE.length == 0 &&
          this.DRAW_BILL_TYPE.length == 0
        ) {
          this.$vux.toast.text("内容不能为空");
          return;
        }
        const M_CID = getsn();
        Vue.set(this, "M_CID", M_CID);
        let data = [
          {
            M_CID: M_CID,
            APP_NO: this.APP_NO,
            CHANGE_TYPE: type == 2 ? "3" : "1",
            CONS_NO: this.CONS_NO,
            BILL_TYPE: this.BILL_TYPE[0],
            VAT_NAME: this.VAT_NAME,
            VAT_NO: this.VAT_NO,
            BANK_CODE: this.BANK_CODE,
            VAT_ACCT: this.VAT_ACCT,
            REG_ADDR: this.REG_ADDR,
            DRAW_BILL_TYPE: this.DRAW_BILL_TYPE[0]
          }
        ];
        sqlInsert("NOTE_INFO_CHANGE", data, this.callback);
        if (this.FILE.length > 0) {
          const fileData = [
            {
              M_CID: getsn(),
              TICKET_CID: M_CID,
              FILE_ID: this.FILE[0].FILE_ID
            }
          ];
          sqlFILE_Insert(
            "TICKET_FILE_RELATION",
            fileData,
            this.photoFileCallback
          );
        }
      }
    },
    photoFileCallback(str, msg) {
      console.log("图片上传", str, msg);
      if (str == "sqlFILE_Delete") {
        const fileData = [
          {
            M_CID: getsn(),
            TICKET_CID: this.M_CID,
            FILE_ID: this.FILE[0].FILE_ID
          }
        ];
        sqlFILE_Insert(
          "TICKET_FILE_RELATION",
          fileData,
          this.photoFileCallback
        );
      }
    },
    callback(str, msg) {
      if (this.submitType == 1) {
        if (msg.resultCode === "9999") {
          if (str == "sqlInsert") {
            this.$vux.toast.text("添加成功");
            Vue.set(this, "change_type", 2);
          } else if (str == "sqlUpdata") {
            this.$vux.toast.text("修改成功");
          }
        } else {
          this.$vux.toast.text("失败");
        }
      } else {
        this.$vux.toast.text("提交成功");
      }
    },
    submitAction: function() {
      console.log("提交", !this.M_CID ? getsn() : this.M_CID);
      const data = {
        NOTE_INFO: [
          {
            VAT_ID: this.VAT_ID,
            APP_NO: this.userInfoData.APP_NO,
            M_VAT_ID: !this.M_CID ? getsn() : this.M_CID,
            CONS_NO: this.CONS_NO,
            VAT_NAME: this.VAT_NAME,
            VAT_NO: this.VAT_NO,
            VAT_ACCT: this.VAT_ACCT,
            BANK_CODE: this.BANK_CODE,
            REG_ADDR: this.REG_ADDR,
            BILL_TYPE: this.BILL_TYPE[0],
            DRAW_BILL_TYPE: this.DRAW_BILL_TYPE[0]
          }
        ]
      };
      console.log(data);
      // submitremoval(data, "RCS028", this.submitActionCallback);
    },
    submitActionCallback(result) {
      if (result.resultCode === "9999") {
        this.saveAction(2);
      }
    },
    onPopupChange(val, str) {
      console.log("val change", val);
      switch (str) {
        case "BILL_TYPE":
          this.BILL_TYPE = val;
          break;
        case "DRAW_BILL_TYPE":
          this.DRAW_BILL_TYPE = val;
          break;
        default:
          break;
      }
    },
    // addIconClick() {
    //   this.VAT_NAME = "";
    //   this.VAT_NO = "";
    //   this.BANK_CODE = "";
    //   this.VAT_ACCT = "";
    //   this.REG_ADDR = "";
    //   this.BILL_TYPE = [];
    //   this.DRAW_BILL_TYPE = [];
    //   this.photoPath = "";
    //   this.FILE = [];
    //   Vue.set(this, "change_type", 1);
    // },
    //图片上传
    takePhoto() {
      takePhoto(
        "",
        this.CONS_NO,
        "1204",
        "0",
        this.takePhotoCallback,
        this.errorCall
      );
    },
    takePhotoCallback(result) {
      console.log("上传成功", result.path);
      this.FILE.push({
        FILE_ID: result.fileId,
        PATH: result.path
      });
      Vue.set(this, "photoPath", result.path);
    },
    deletePhoto() {
      deletePhoto(this.photoPath, this.deletePhotoCallback);
    },
    deletePhotoCallback(msg) {
      Vue.set(this, "photoPath", "");
      Vue.set(this, "FILE", []);
    },

    errorCall(error) {
      console.log("失败", error);
    }
  }
};
</script>

<style scoped lang="less">
@import "../../assets/less/style.less";
.maintain {
  background-color: #ffffff;
}
.maintainContent {
  padding: 0 0.2778rem;
  background-color: #ffffff;
  border-bottom: 1px solid #d9daeb;
}
.information-image-icon {
  margin: 0.8rem auto 0;
}
</style>
<style>
@import "../../assets/less/vuxStyle.less";
</style>